<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="单据编号" class="form-item">
              <j-input placeholder="请输入单据编号" v-model="queryParam.billNo"></j-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="认领人">
              <select-user-by-dep :multi="false" v-model="queryParam.employeeId"></select-user-by-dep>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="收款单位名称">
              <select-Company-input v-model="queryParam.payeeUnit" placeholder="请选择收款单位" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="汇款单位名称">
              <select-customer-input v-model="queryParam.remittanceUnit" commercialType="1" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="是否是保证金">
              <j-dict-select-tag placeholder="请选择是否是保证金" v-model="queryParam.isDeposit" dictCode="yes_or_no" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="汇款金额">
              <a-input-number
                placeholder="请输入最小值"
                class="query-group-cust"
                :precision="2"
                v-model="queryParam.remittanceAmount_begin"
                style="width: calc(50% - 15px)"
              ></a-input-number>
              <span class="query-group-split-cust"></span>
              <a-input-number
                placeholder="请输入最大值"
                class="query-group-cust"
                :precision="2"
                :min="queryParam.remittanceAmount_begin"
                v-model="queryParam.remittanceAmount_end"
                style="width: calc(50% - 15px)"
              ></a-input-number>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="汇款日期">
                <a-range-picker v-model="createTimeRange"
                  format="YYYY-MM-DD"
                  :placeholder="['开始时间', '结束时间']"
                  @change="onCreateTimeChange" />
              </a-form-item>
            </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="流程状态">
              <j-dict-select-tag placeholder="请选择流程状态" v-model="queryParam.bpmStatus" dictCode="bpm_status" />
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="createTimeRange=[],searchReset()" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button
        @click="handleAdd"
        type="primary"
        icon="plus"
        :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:add')"
        >新增</a-button
      >
      <a-button type="primary" icon="download" @click="handleExportXls('收款申请单')">导出</a-button>
      <!-- <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import" :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:import')">导入</a-button>
      </a-upload> -->
      <!-- 高级查询区域 -->
      <!--<j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>-->
      <!--      <a-dropdown v-if="selectedRowKeys.length > 0">-->
      <!--        <a-menu slot="overlay">-->
      <!--          <a-menu-item key="1" @click="batchDel" :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:delete')"><a-icon type="delete"/>删除</a-menu-item>-->
      <!--        </a-menu>-->
      <!--        <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>-->
      <!--      </a-dropdown>-->
      <a-popover title="自定义列" trigger="click" placement="leftBottom">
        <template slot="content">
          <a-checkbox-group @change="onColSettingsChange" v-model="settingColumns" :defaultValue="settingColumns">
            <a-row>
              <template v-for="(item, index) in defColumns">
                <template v-if="item.key != 'rowIndex' && item.dataIndex != 'action'">
                  <a-col :span="12" :key="index"
                    ><a-checkbox :value="item.dataIndex">{{ item.title }}</a-checkbox></a-col
                  >
                </template>
              </template>
            </a-row>
          </a-checkbox-group>
        </template>
        <a style="float: right"><a-icon type="setting" :style="iconStyle" /></a>
      </a-popover>
    </div>

    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
        <a style="font-weight: 600">{{ selectedRowKeys.length }}</a
        >项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>

      <a-table
        ref="table"
        size="middle"
        :scroll="{ x: scrollX }"
        :components="draggableComponent"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        class="j-table-force-nowrap"
        :customRow="customRow"
        @change="handleTableChange"
      >
        <a slot="billNo" slot-scope="text, record" @click="getDetail(record.id)">{{ text }}</a>
        <span slot="notify" slot-scope="text, record">
          <a-icon
            title="催办提醒"
            v-if="record.taskUrge"
            theme="twoTone"
            twoToneColor="#eb2f96"
            @click="taskNotifyMe(flowCode, record.id)"
            type="notification"
          />
          {{ text }}
        </span>
        <template slot="status" slot-scope="status">
          <a-badge :status="status | statusTypeFilter" :text="status | statusFilter" />
        </template>
        <template slot="htmlSlot" slot-scope="text">
          <div v-html="text"></div>
        </template>
        <template slot="imgSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
          <img
            v-else
            :src="getImgView(text)"
            height="25px"
            alt=""
            style="max-width: 80px; font-size: 12px; font-style: italic"
          />
        </template>
        <template slot="fileSlot" slot-scope="text">
          <span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
          <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="downloadFile(text)">
            下载
          </a-button>
        </template>

        <span slot="action" slot-scope="text, record">
          <template v-if="record.bpmStatus === '1'">
            <a
            type="primary"
              size="small"
              @click="handleEdit(record)"
              :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:edit')">编辑
          </a>
            <a-divider type="vertical" />
            <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
              <a
              type="primary"
              size="small"
                :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:delete')">删除
            </a>
            </a-popconfirm>
            <!-- <a-divider type="vertical"/>
            <a-button type="primary" size="small"   @click="beginProcess(record)" :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:startProcess')">发起流程</a-button> -->
          </template>
          <template v-if="record.bpmStatus !== '1' && record.bpmStatus !== '4'">
            <a
              type="primary"
              size="small"
              @click="handleTrack(record)"
              :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:viewTrack')"
              >审批进度</a
            >
          </template>

          <template v-if="record.bpmStatus === '3'">
            <a-divider type="vertical" />
            <a-popconfirm title="确定要作废吗?" @confirm="() => invalidProcess(record)">
              <a
                type="primary"
                size="small"
                :disabled="isDisabledAuth('erpFinanceCollectMoneyApplicationBill:invalidProcess')"
              >
                作废流程
              </a>
            </a-popconfirm>
          </template>

          <template v-if="record.bpmStatus === '2' && record.isDeposit=='0'">
            <a-divider type="vertical" />
              <a
              @click="handleProject(record)"
                type="primary"
                size="small"
              >
              疑似合同
              </a>
          </template>
          <template v-if="record.bpmStatus === '2'">
            <a-divider type="vertical" />
              <a
                @click="showCandidateTaskList(record)"
                type="primary"
                size="small"
              >
              流程候选人
              </a>
          </template>
        </span>
      </a-table>
    </div>
    <process-config-modal ref="processConfig" @ok="handleSuccess" @close="handleClose"></process-config-modal>
    <erp-finance-collect-money-application-bill-modal
      ref="modalForm"
      @ok="modalFormOk"
    ></erp-finance-collect-money-application-bill-modal>
    <bpm-biz-task-deal-modal
      ref="taskDealModal"
      :path="path"
      :formData="formData"
      @ok="handleOk"
    ></bpm-biz-task-deal-modal>
    <ErpProjectContractManagerListPenetrate ref="contractList"></ErpProjectContractManagerListPenetrate>
    <ProcessCandidateTaskListPenetrate ref="candidateTaskList"></ProcessCandidateTaskListPenetrate>
    <bpm-process-track-modal ref="bpmProcessTrackModal"></bpm-process-track-modal>
    <biz-task-notify-modal ref="taskNotifyModal"></biz-task-notify-modal>
    <biz-task-notify-me-modal ref="taskNotifyMeModal"></biz-task-notify-me-modal>
  </a-card>
</template>

<script>
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgBpmListMixin } from '@/mixins/JeecgBpmListMixin'
import BpmBizTaskDealModal from '@/views/modules/bpmbiz/common/BpmBizTaskDealModal.vue'
import BpmProcessTrackModal from '@/views/modules/bpmbiz/common/BpmProcessTrackModal.vue'
import BizTaskNotifyModal from '@/views/modules/bpmbiz/common/BizTaskNotifyModal.vue'
import BizTaskNotifyMeModal from '@/views/modules/bpmbiz/common/BizTaskNotifyMeModal.vue'
import ErpFinanceCollectMoneyApplicationBillModal from './modules/ErpFinanceCollectMoneyApplicationBillModal'
import { getAction, postAction } from '@/api/manage'
import moment from 'moment'
import { DisabledAuthFilterMixin } from '@/mixins/DisabledAuthFilterMixin'
import SelectCustomerInput from '@/views/scy/components/SelectCustomerInput'
import SelectPersonInput from '@/views/scy/components/SelectPersonInput'
import ProcessConfigModal from '@/views/scy/components/ProcessConfigModal'
import SelectUserByDep from '@/views/scy/components/SelectUserByDep'
import SelectCompanyInput from '@/views/scy/components/SelectCompanyInput'
import ProcessCandidateTaskListPenetrate from "@/views/modules/bpm/task/ProcessCandidateTaskListPenetrate";
import ErpProjectContractManagerListPenetrate from "@/views/scy/penetrate/ErpProjectContractManagerListPenetrate";


export default {
  name: 'ErpFinanceCollectMoneyApplicationBillList',
  mixins: [JeecgBpmListMixin, mixinDevice, DisabledAuthFilterMixin],
  components: {
    ErpFinanceCollectMoneyApplicationBillModal,
    BpmBizTaskDealModal,
    BpmProcessTrackModal,
    BizTaskNotifyModal,
    BizTaskNotifyMeModal,
    SelectCustomerInput,
    ProcessConfigModal,
    SelectPersonInput,
    SelectUserByDep,
    ProcessCandidateTaskListPenetrate,
    ErpProjectContractManagerListPenetrate,
    SelectCompanyInput,
  },
  data() {
    return {
      createTimeRange:[],
      queryParam: {},
      description: '收款申请单管理页面',
      //表头
      columns: [],
      //列设置
      settingColumns: [],
      // 列定义
      defColumns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '单据编号',
          align: 'center',
          dataIndex: 'billNo',
          scopedSlots: { customRender: 'billNo' },
          ellipsis: true,
          width: 160,
        },
        {
          title: '认领人',
          align: 'center',
          dataIndex: 'employeeId_dictText',
          ellipsis: true,
          width: 160,
        },
        {
          title: '申请部门',
          align: 'center',
          dataIndex: 'proposerDeptId_dictText',
          width: 150,
          ellipsis: true,
        },
        {
          title: '汇款单位',
          align: 'center',
          dataIndex: 'remittanceUnit_dictText',
          ellipsis: true,
          width: 160,
        },
        {
          title: '收款单位',
          align: 'center',
          dataIndex: 'payeeUnit_dictText',
          ellipsis: true,
          width: 160,
        },
        {
          title: '汇款日期',
          align: 'center',
          dataIndex: 'remittanceDate',
          customRender: function (text) {
            return !text ? '' : text.length > 10 ? text.substr(0, 10) : text
          },
          ellipsis: true,
          width: 160,
        },
        {
          title: '汇款金额（元）',
          align: 'center',
          dataIndex: 'remittanceAmount',
          ellipsis: true,
          width: 160,
        },
        {
          title: '是否为保证金',
          align: 'center',
          dataIndex: 'isDeposit_dictText',
          ellipsis: true,
          width: 160,
        },
        {
          title: '流程状态',
          align: 'center',
          dataIndex: 'bpmStatus_dictText',
          ellipsis: true,
          width: 160,
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed:"right",
          width: 250,
          scopedSlots: {
            filterDropdown: 'filterDropdown',
            filterIcon: 'filterIcon',
            customRender: 'action',
          },
        },
      ],
      url: {
        list: '/api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/allList',
        delete: '/api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/delete',
        deleteBatch: '/api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/deleteBatch',
        exportXlsUrl: '/api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/exportAllXls',
        importExcelUrl: 'api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/importExcel',
        bizCount: '/api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/bizCount',
        invalidProcess: '/api/erp/finance/collectMoney/erpFinanceCollectMoneyApplicationBill/invalidCompleteProcess',
        taskAllHistoryList: "/api/erpmng/act/task/taskAllHistoryList"
      },
      //代码生成后需手动设置流程编码
      flowCode: 'onl_erp_finance_collect_money_application_bill',
      formUrl: '/erp/finance/collectMoney/modules/ErpFinanceCollectMoneyApplicationBillForm',
      beanName: 'erpFinanceCollectMoneyApplicationBillServiceImpl',
      formUrlMobile: '/pages/synergy/collectMoneyApplicationBill',
      dictOptions: {},
      superFieldList: [],
      processId: '1521814569456091137',
    }
  },
  created() {
    this.getSuperFieldList()
  },
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
    },
  },
  methods: {
    handleProject(record){
      this.$refs.contractList.company=record.payeeUnit;
      this.$refs.contractList.unit=record.remittanceUnit;
      this.$refs.contractList.collectId=record.id;
      this.$refs.contractList.initData(record.payeeUnit,record.remittanceUnit);
      this.$refs.contractList.visible = true;
    },
    showCandidateTaskList(record){
      let that=this
      getAction(this.url.taskAllHistoryList, {'businessKey':record.id}).then((res) => {
        if (res.success) {
          if(res.result.records){
            if(res.result.records){
              if(!res.result.records[0].taskAssigneeName && !res.result.records[0].taskEndTime){
                let taskId=res.result.records[0].id;
                that.$refs.candidateTaskList.taskId=taskId;
                that.$refs.candidateTaskList.visible=true;
                that.$refs.candidateTaskList.loadData();
              }else if(res.result.records[0].taskAssigneeName && !res.result.records[0].taskEndTime){
                that.$message.warning("当前流程已在【"+res.result.records[0].taskAssigneeName+"】待办中！")
              }else{
                that.$message.warning("未找到候选人")
              }
            }
          }
        } else {
          that.$message.warning("未找到候选人")
        }
      })
      },
    onCreateTimeChange(dateString) {
        this.queryParam.remittanceDate_begin=moment(dateString[0]).format('YYYY-MM-DD');
        this.queryParam.remittanceDate_end=moment(dateString[1]).format('YYYY-MM-DD');
      },
    // 流程作废
    invalidProcess(record) {
      var that = this
      var params = { id: record.id } // 查询条件
      getAction(that.url.invalidProcess, params).then((res) => {
        if (res.success) {
          that.$message.success(res.message)
          that.loadData()
        } else {
          that.$message.warning(res.message)
          that.loadData()
        }
      })
    },
    beginProcess(record) {
      this.$refs.processConfig.visible = true
      this.$refs.processConfig.formUrl = this.formUrl
      this.$refs.processConfig.formUrlMobile = this.formUrlMobile
      this.$refs.processConfig.flowCode = this.flowCode
      this.$refs.processConfig.edit(record, this.processId, this.beanName)
    },
    handleSuccess() {
      this.loadData()
      this.onClearSelected()
      this.$refs.modalForm.handleCancel()
    },
    // 新增流程取消关闭弹窗刷新页面
    handleClose() {
      this.$refs.modalForm.handleCancel()
      this.loadData()
    },
    //流程审批结束禁用
    getCheckboxProps(record) {
      return {
        props: {
          disabled: record.bpmStatus !== '1',
        },
      }
    },
    // table 双击查看详情
    customRow(record) {
        return {
          on: {
            // 事件
            dblclick: event => {
              this.$router.push({
                path: `/erp/finance/collectMoney/ErpFinanceCollectMoneyApplicationBillListDetail/${record.id}`,
              })
            }
          }
        }
      },
    //查看详情
    getDetail(id) {
      this.$router.push({
        path: `/erp/finance/collectMoney/ErpFinanceCollectMoneyApplicationBillListDetail/${id}`,
      })
    },
    handleEdit: function (record) {
      this.$refs.modalForm.edit(record, true)
      this.$refs.modalForm.title = '编辑'
      this.$refs.modalForm.disableSubmit = false
    },
    initDictConfig() {},
    getSuperFieldList() {
      let fieldList = []
      fieldList.push({ type: 'string', value: 'handlerId', text: '经办人编号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'handlerDeptId', text: '经办人部门ID', dictCode: '' })
      fieldList.push({ type: 'string', value: 'handlerDeptCode', text: '经办人部门编码', dictCode: '' })
      fieldList.push({ type: 'string', value: 'delFlag', text: '是否已删除', dictCode: '' })
      fieldList.push({ type: 'string', value: 'billNo', text: '单据编号', dictCode: '' })
      fieldList.push({ type: 'string', value: 'remittanceUnit', text: '汇款单位名称', dictCode: '' })
      fieldList.push({ type: 'date', value: 'remittanceDate', text: '汇款日期' })
      fieldList.push({ type: 'BigDecimal', value: 'remittanceAmount', text: '汇款金额', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeUnit', text: '收款单位名称', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payeeAccountNo', text: '收款账户', dictCode: '' })
      fieldList.push({ type: 'string', value: 'remark', text: '备注', dictCode: '' })
      fieldList.push({ type: 'Text', value: 'attachments', text: '附件', dictCode: '' })
      fieldList.push({ type: 'string', value: 'payMode', text: '支付方式', dictCode: '' })
      fieldList.push({ type: 'string', value: 'depositBillId', text: '关联保证金申请单', dictCode: '' })
      fieldList.push({ type: 'string', value: 'isDeposit', text: '是否为保证金', dictCode: '' })
      fieldList.push({ type: 'string', value: 'checkStatus', text: '审核状态', dictCode: '' })
      fieldList.push({ type: 'string', value: 'bpmStatus', text: '流程状态', dictCode: '' })
      this.superFieldList = fieldList
    },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
